<template>
  <div>
    <t-navbar title="ToDoList" :fixed="false" />
  </div>
  <t-tabs :value="currentValue" :list="tabPanels" @change="changeTab">
    <div v-if="currentValue==1" @click="tz1">
    </div>
    <div v-if="currentValue==2" @click="tz2">
    </div>
    <div v-if="currentValue==3" @click="tz3">
    </div>
    <div v-if="currentValue==4" @click="tz4">
    </div>
  </t-tabs>

  <!--  <div style="border:1px solid #000;">-->
  <div style="margin-top: 50px; " >

    <div v-for="(l,index) in logs1" :key="index" style="margin-top: 8px;padding: 15px;border-bottom: 1px solid grey">
      <div style="font-weight: bold">计划概述:  {{l.content}}</div>
      <div style="margin-top: 5px">
        <div style="font-size: 12px;color: grey">开始时间: {{l.createTime}}</div>
        <div style="font-size: 12px;color: grey">结束时间: {{l.endTime}}</div>
        <div style="margin-top: 5px">计划内容: {{l.content}}</div>
      </div>

    </div>

  </div>


  <div>
    <t-fab style="right: 24px;bottom: 80px" :icon="iconFunc" text="计划" @click="tz('/addplan')" />
  </div>
</template>

<script setup>
import {ref, onMounted, h} from 'vue'
import {get, post} from "../util/Request.js";
import {AddIcon} from 'tdesign-icons-vue-next';
import {useRouter} from "vue-router";

const router = useRouter()
const currentValue = ref('1');
const tabPanels = [
  {
    value: '1',
    label: '日计划',
  },
  {
    value: '2',
    label: '周计划',
  },
  {
    value: '3',
    label: '月计划',
  },
  {
    value: '4',
    label: '年计划',
  },
];

onMounted(() => {
  //请求接口 查询操作日志
  get("/todolist/slectBytype?type=" + 1).then(r => {
    console.log(r.data)
    logs.value = r.data
    // logs.value=r.data
  })
})
const loadData = () => {
  get('/plan/list').then(res => {
    plan.value = res.data
  })
}

const logs1 = ref([])
const changeTab = (val) => {
  //切换
  currentValue.value = val;

  get("/todolist/slectBytype?type=" + currentValue.value).then(r => {
    console.log(r)
    console.log(r.data)
    if (r.code == 0) {
      logs1.value = r.data
    } else {
      Toast(r.data)
    }
  })
  console.log(e);
  loadData()

}
const iconFunc = () => h(AddIcon, {size: '24px'});

const tz = (url) => {
  router.push(url)
}

const tz1 = () => {
  get("/todolist/slectBytype?type=" + 1).then(r => {
    console.log(r)
    console.log(r.data)
    if (r.code == 0) {
      logs.value = r.data
    } else {
      Toast(r.data)
    }
  })
  console.log(e);
  loadData()
}

const tz2 = () => {
  get("/todolist/slectBytype?type=" + 2).then(r => {
    console.log(r)
    console.log(r.data)
    if (r.code == 0) {
      logs.value = r.data
    } else {
      Toast(r.data)
    }
  })
  console.log(e);
  loadData()
}


const tz3 = () => {
  get("/todolist/slectBytype?type=" + 3).then(r => {
    console.log(r)
    console.log(r.data)
    if (r.code == 0) {
      logs.value = r.data
    } else {
      Toast(r.data)
    }
  })
  console.log(e);
  loadData()
}

const tz4 = () => {
  get("/todolist/slectBytype?type=" + 4).then(r => {
    console.log(r)
    console.log(r.data)
    if (r.code == 0) {
      logs.value = r.data
    } else {
      Toast(r.data)
    }
  })
  console.log(e);
  loadData()
}

</script>

<style scoped>


</style>
